<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h2>this指向</h2>
    <button class="btn">点我</button>
</body>
<script>
    //1.全局this ===window
  //  console.log(this===window)

    //2.函数中的this==window
//     function fn() {
//         console.log(this===window)

//     }

//    fn()

   //构造函数中的this==实例化对象本身
//    function fn() {
//         console.log(this===window)
//         this.name='hello'
//         this.age=20

//     }

//   const p=new fn()
//   console.log(p.name)
//   console.log(p.age)

//对象中的this
// let obj={
//     name:'alice',
//     age:20,
//     sayName:function() {
//         console.log(this)
//     }
// }
// obj.sayName()

//定时器中的this
let obj={
    name:'alice',
    age:20,
    sayName:function() {
        let _this=this;
        console.log(this)
       setTimeout(function(){
        console.log(_this)
       },1000)
    }
}
obj.sayName()

//dom事件中this
// document.querySelector('.btn').addEventListener('click',function() {
//     console.log(this)
//     this.style.background='#f00'
// })

</script>
</html>